<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<head>
  <meta charset="UTF-8">

  <meta name="description" content="">
  <meta name="keywords" content="">

  <title>Login</title>

  <link href="/css/style.css" media="screen" rel="stylesheet" type="text/css">
  <link href="/css/grid.css" media="screen" rel="stylesheet" type="text/css">
  <link href="/css/element.css" media="screen" rel="stylesheet" type="text/css">
  <style>
    .grid_product {
      /* margin: 42px -12px 10px; */
      width: 968px!important;
    }
     .grid_121,.grid_3 {
      display: inline;
      float: left;
      margin-left: 12px;
       margin-right: 1px!important;
    }

  </style>

  <script src="/js/jquery-1.7.2.min.js" ></script>
  <script src="/js/html5.js" ></script>
  <script src="/js/jflow.plus.js"></script>
  <script src="/js/jquery.carouFredSel-5.2.2-packed.js"></script>
  <script src="/js/checkbox.js"></script>
  <script src="/js/radio.js"></script>
  <script src="/js/selectBox.js"></script>
  <script src="/js/vue.js"></script>
  <script src="/js/element.js"></script>


  <script>
      $(document).ready(function() {
          $("select").selectBox();
      });
      function ahref() {
          window.location.href = "/collect/getCollect?userId="+sessionStorage.getItem("userId");
      }
  </script>

  <script>
      function collection(){
          window.location.href = "/collect/getCollect?userId="+sessionStorage.getItem("userId");
      }

      $(document).ready(function(){
          $("#myController").jFlow({
              controller: ".control", // must be class, use . sign
              slideWrapper : "#jFlowSlider", // must be id, use # sign
              slides: "#slider",  // the div where all your sliding divs are nested in
              selectedWrapper: "jFlowSelected",  // just pure text, no sign
              width: "984px",  // this is the width for the content-slider
              height: "480px",  // this is the height for the content-slider
              duration: 400,  // time in miliseconds to transition one slide
              prev: ".slidprev", // must be class, use . sign
              next: ".slidnext", // must be class, use . sign
              auto: true
          });
      });
  </script>
  <script>
      $(function() {
          $('#list_product').carouFredSel({
              prev: '#prev_c1',
              next: '#next_c1',
              auto: false
          });
          $('#list_product2').carouFredSel({
              prev: '#prev_c2',
              next: '#next_c2',
              auto: false
          });
          $('#list_banners').carouFredSel({
              prev: '#ban_prev',
              next: '#ban_next',
              scroll: 1,
              auto: false
          });
          $(window).resize();
      });
  </script>
  <script>
      $(document).ready(function(){
          $("button").click(function(){
              $(this).addClass('click')
          });
      })
  </script>
  <script type="text/javascript">
      $(function () {
          var search = $(".entry_form").val() == undefined ? '' : $(".entry_form").attr("value").trim();
          var pagination = $(".pagination_a").html()== undefined ? '': $(".pagination_a").html().trim();; // 第几页，默认第一页
          var userId =sessionStorage.getItem("userId");

          //搜索框事件
          $(".search").keypress(function (even) {
              if (even.which == 13) {
                  search =$(this).val();
                  requestGoodsByCondition();
              }
          });

          // 通过条件获取商品信息
          function requestGoodsByCondition() {
              $("#grid_product .product").remove();//清除数据
              $("#pagination ul").remove();//清除分页
              //封装方法
              var r ;//数据
              var numbers;//分页数据
              var conditionData = {
                  "search":search,//搜索
                  "startPage": pagination,     // 从第几页开始
                  "userId":userId

              };
              var conditionDataJSON = JSON.stringify(conditionData);
              $.ajax({
                  type: 'post',
                  dataType: 'json',
                  url: '/collect/getCollectByUser',
                  data: conditionDataJSON,
                  contentType: "application/json",
                  cache: false,
                  async: true,
                  success: function (data) {

                      /**
                       *
                       * 所有分页带条件的数据在data里面
                       */
                      //清空原来,保留头部信息
                      if (data.list!=null || data.list!=""){
                          r=data.list;
                          for (var i = 0; i < r.length; i++) {
                              console.log(r[i].gname);
                              var  newPrice =(r[i].price*1.2).toFixed(2);
                              $("#grid_product").append('<div class="grid_3 product" id="grid_3"><div class="prev"><a href="javaScript:void(0);" class="getByGoodsId" alt="'+r[i].gid+'"><img src="'+
                                  r[i].gimage+'" alt="" title="" /></a></div><h3 class="title">'+
                                  r[i].gname+'</h3><div class="cart"><div class="price"><div class="vert"><div class="price_new">￥'+
                                  r[i].price+'</div><div class="price_old">￥'+
                                  newPrice+'</div></div></div><a href="javascript:void(0);" class="obn"></a><a href="javascript:void(0);" class="bay" alt="'+
                                  r[i].gid+'"></a><a href="javascript:void(0);" class="like" alt="'+
                                  r[i].gid+'"></a></div></div>');
                          }
                          /*收藏*/
                          $(".like").click(function () {
                              var uid=sessionStorage.getItem("userId");
                              var  gid =$(this).attr("alt");
                              //一种
                              var json={
                                  "gid":gid,
                                  "userId":uid
                              };
                              var flag = confirm('是否取消？');
                              if (flag) {
                                  $.post("/collect/delLike", json, function (r) {
                                      console.log(r);
                                      if (r == "ok") {
                                          requestGoodsByCondition();
                                      } else if (r == "err") {
                                          var flag = confirm('请登陆！！！！！！！');
                                          if (flag) {
                                              window.location.href = "/qd/login.html";
                                          }
                                      } else {
                                          alert("取消收藏失败！！！！！！！！！");


                                      }

                                  }, "text");
                              }

                          });
                          /***
                           * 加入购物车
                           */
                          $(".bay").click(function () {
                              var uid=sessionStorage.getItem("userId");
                              var  gid =$(this).attr("alt");
                              //一种
                              var json={
                                  "gid":gid,
                                  "userId":uid
                              };
                              $.post("/shoppingcart/addShopping",json,function(r){
                                  if(r=="ok"){
                                      alert("成功加入购物车！！！！！");
                                  }else if (r=="err") {
                                      var flag =confirm('请登陆！！！！！！！');
                                      if (flag) {
                                          window.location.href="/qd/login.html";
                                      }
                                  }else{
                                      alert("加入购物车失败！！！！！！！！！");


                                  }

                              },"text");


                          });
                          /*
                          分页数据绑定
                           */
                          if(data.navigatepageNums!=null || data.navigatepageNums!="") {
                              var i=0;
                              numbers =data.navigatepageNums;
                              var html ='<ul><li class="prev prefix_1next" value="'+data.prePage+'"><span>&#8592;</span></li>';
                              if(data.pageNum>1){
                                  i=data.pageNum-1;
                              }
                              for (i ; i < numbers.length; i++) {
                                  if (numbers[i]==data.pageNum) {
                                      html+='<li class="curent" ><a href="javaScript:void (0);" class="pagination_a">'+numbers[i]+'</a></li>';
                                  }
                                  if (numbers[i]>=(data.pageNum+3)) {
                                      html+=' <li><span disabled ="disabled">...</span></li>';
                                      html+='<li><a href="javaScript:void (0);" class="pagination_a">'+numbers[i]+'</a></li>';
                                      break;
                                  }else {
                                      if (numbers[i]!=data.pageNum) {
                                          html+='<li ><a href="javaScript:void (0);"  class="pagination_a">'+numbers[i]+'</a></li>';
                                      }
                                  }
                              }
                              html+='<li class="next prefix_1next" value="'+data.nextPage+'"><a href="javaScript:void (0);">&#8594;</a></li></ul>';

                              $("#pagination").append(html);

                              // 第几页改变
                              $(".pagination_a").each(function () {
                                  $(this).click(function () {
                                      pagination = $(this).html();
                                      $(this).parent().addClass('curent');
                                      requestGoodsByCondition();
                                  })
                              });
                              $(".prefix_1next").click(function () {
                                  pagination = $(this).attr("value");
                                  if (pagination==0) {
                                      alert("这是第一页啦！");
                                  }else  if(pagination==numbers[numbers.length]){
                                      alert("这是最后一页啦！");
                                  } else {
                                      requestGoodsByCondition();
                                  }
                              });

                              / * 商品详情*/
                              $(".getByGoodsId").click(function () {
                                  var  gid =$(this).attr("alt");
                                  window.location.href="/goods/getByIdGoods?id="+gid;
                              });

                          }

                      }else{

                      }
                      console.log(data);
                  }
              });
          }
          requestGoodsByCondition();

      });

  </script>
  <script>
      $(function () {
          var uid=sessionStorage.getItem("userId");
          var conditionData = {
              "userId":uid//用户编号
          };
          var conditionDataJSON = JSON.stringify(conditionData);
          $.ajax({
              type: 'post',
              url: "/shoppingcart/getListBayIndex",    // 提交到controller的url路径
              data: conditionDataJSON,
              contentType: "application/json",
              cache: false,
              async: true,
              success: function (data) {    // 请求成功后的回调函数，其中的参数data为controller返回的map,也就是说,@ResponseBody将返回的map转化为JSON格式的数据，然后通过data这个参数取JSON数据中的值;;
                  var jsonString = JSON.parse(data) ;
                  if (jsonString.msg == "ok") {
                      $(".grid_6 #cart_nav li .cart_cont").remove();
                      $(".grid_6 #cart_nav li a.cart_li span").html(jsonString.sum+"件");
                      var r =jsonString.shoppingcartList;
                      var html ='<ul class="cart_cont"><li class="no_border"><p>最近添加的项目</p></li><li>';
                      for (var i=0;i<r.length;i++){
                          html +='<li><a href="javaScript:void(0);"alt="' +
                              r[i].goods.gid+'" class="prev_cart getByGoodsId"><div class="cart_vert"><img src="' +
                              r[i].goods.gimage+'" alt="" title="" /></div></a><div class="cont_cart"><h4>' +
                              r[i].goods.gname+'</h4><div class="price">￥' +
                              r[i].goods.price+'</div> </div> <a title="close" class="close" href="#"></a><div class="clear"></div></li>';

                      }
                      html+='<li class="no_border"> <a href="/qd/shopping_cart.html" class="view_cart">查看购物车</a><a href="/qd/checkout.html" class="checkout">进行结账</a></li></ul>';
                      $(".grid_6 #cart_nav li").append(html);
                      /*
                      * 商品详情*/
                      $(".getByGoodsId").click(function () {
                          var  gid =$(this).attr("alt");
                          window.location.href="/goods/getByIdGoods?id="+gid;
                      });
                  } else {
                      $(".grid_6 #cart_nav li .cart_cont").remove();
                      $('.grid_6 #cart_nav li .cart_li').click(function() {
                          alert("请登录！！！");

                      });
                  }
              },
          });
      })
  </script>
</head>
<body>
<div id="app">
  <div class="container_12">
    <div id="top">
      <div class="grid_3">
        <div class="phone_top">
          Call Us +777 (100) 1234
        </div><!-- .phone_top -->
      </div><!-- .grid_3 -->

      <div class="grid_6">
        <div class="welcome">
          <div v-if="!flag">欢迎访客，您可以<a href="/qd/login.html" style="color: #fe6400">登录</a> 或
            <a href="/qd/register.html" style="color: #fe6400">创建帐户</a>.</div>
          <div>
            <p v-if="flag">{{userName}}欢迎访问坭兴陶推荐网！<a style="color: #fe6400;margin-left: 10px;cursor: pointer" @click="goOut">退出</a></p>
          </div>
        </div><!-- .welcome -->
      </div><!-- .grid_6 -->

      <div class="grid_3">
        <div class="valuta">
          <ul>
            <li class="curent"><a href="customerService.html">客户服务</a></li>
          </ul>
        </div><!-- .valuta -->

        <div class="lang">
          <ul>
            <li class="curent"><a href="/qd/personCenter.html">个人中心</a></li>
            <li><a href="/qd/blog.html">关于我们</a></li>
            <li><a href="/qd/contact_us.html">联系我们</a></li>
          </ul>
        </div><!-- .lang -->
      </div><!-- .grid_3 -->s
    </div><!-- #top -->

    <div class="clear"></div>

    <header id="branding">
      <div class="grid_3">
        <hgroup>
          <h1 id="site_logo" ><a href="/qd/index.html" title=""><img src="/images/logo.png" alt="钦州坭兴陶" width="200" height="80"/></a></h1>
          <h2 id="site_description">钦州坭兴陶</h2>
        </hgroup>
      </div><!-- .grid_3 -->

      <div class="grid_3">
        <form class="search">
          <input type="text" name="search" class="entry_form" value="" placeholder="找你想要的..."/>
        </form>
      </div><!-- .grid_3 -->

      <div class="grid_6">
        <ul id="cart_nav">
          <li>
            <a class="cart_li" href="#">购物车 <span>￥0.00</span></a>
            <ul class="cart_cont">
              <li class="no_border"><p>最近添加的项目</p></li>
              <li>
                <a href="/qd/product_page.html" class="prev_cart"><div class="cart_vert"><img src="/images/cart_img.jpg" alt="" title="" /></div></a>
                <div class="cont_cart">
                  <h4> 广西钦州坭兴陶茶壶 佛系人生</h4>
                  <div class="price">￥399.00</div>
                </div>
                <a title="close" class="close" href="#"></a>
                <div class="clear"></div>
              </li>

              <li>
                <a href="/qd/product_page.html" class="prev_cart"><div class="cart_vert"><img src="/images/produkt_slid1.jpg" alt="" title="" /></div></a>
                <div class="cont_cart">
                  <h4>纯手工刻绘品茗杯茶具小茶杯小杯子 高身收口杯</h4>
                  <div class="price">￥399.00</div>
                </div>
                <a title="close" class="close" href="#"></a>
                <div class="clear"></div>
              </li>
              <li class="no_border">
                <a href="/qd/shopping_cart.html" class="view_cart">查看购物车</a>
                <a href="/qd/shopping_cart.html" class="checkout">进行结账</a>
              </li>
            </ul>
          </li>
        </ul>

        <nav class="private">
          <ul>
            <li><a href="/qd/personCenter.html">我的账户</a></li>
            <li class="separator">|</li>
            <li><a href="javascript:ahref();">我的收藏</a></li>
            <li class="separator">|</li>
            <li><a href="/qd/orderInfo.html">我的订单</a></li>
          </ul>
        </nav><!-- .private -->
      </div><!-- .grid_6 -->
    </header><!-- #branding -->
  </div><!-- .container_12 -->

  <div class="clear"></div>
  <div id="block_nav_primary">
    <div class="container_12">
      <div class="grid_12">
        <nav class="primary">
          <ul>
            <li class="curent"><a href="/goods/index.html">首页</a></li>
            <li><a href="/qd/all_catalog.html">全部宝贝</a></li>
            <li><a href="/qd/catalog_grid.html">热销推荐</a></li>
            <li><a href="/qd/compare.html">猜你喜欢</a></li>
            <li>
              <a href="/qd/catalog_list.html">新品推荐</a>
            </li>


            <li>
              <a href="#">更多精彩</a>
              <ul class="sub">
                <li><a href="/qd/contact_us.html">联系我们</a></li>
                <li><a href="/qd/blog.html">关于我们</a></li>

              </ul>
            </li>
          </ul>
        </nav><!-- .primary -->
      </div><!-- .grid_12 -->
    </div><!-- .container_12 -->
  </div><!-- .block_nav_primary -->

    <div class="container_12">
      <div  class="grid_121">
        <div class="grid_product" id="grid_product">
          <div class="grid_3 product" id="grid_3">
            <div class="prev">
              <a href="product_page.html"><img src="images/product_1.jpg" alt="" title="" /></a>
            </div><!-- .prev -->
            <h3 class="title">钦州坭兴陶茶壶大容量刻字小号家用非紫砂泡茶壶茶具</h3>
            <div class="cart">
              <div class="price">
                <div class="vert">
                  <div class="price_new">￥550.00</div>
                  <div class="price_old">￥725.00</div>
                </div>
              </div>
              <a href="#" class="obn"></a>
              <a href="#" class="like"></a>
              <a href="#" class="bay"></a>
            </div><!-- .cart -->
          </div><!-- .grid_3 -->
        </div><!-- .grid_product -->

        <div class="clear"></div>

        <div class="pagination" id="pagination">
          <ul>
            <li class="prev"><span>&#8592;</span></li>
            <li class="curent"><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li><span>...</span></li>
            <li><a href="#">100</a></li>
            <li class="next"><a href="#">&#8594;</a></li>
          </ul>
        </div><!-- .pagination -->
      </div><!-- #content -->

      <div class="clear"></div>

    </div><!-- .container_12 -->

  <div class="clear"></div>

  <footer>
    <div class="f_navigation">
      <div class="container_12">
        <div class="grid_3">
          <h3>联系我们</h3>
          <ul class="f_contact">
            <li>钦州湾广场</li>
            <li>+777 (100) 1234</li>
            <li>mail@example.com</li>
          </ul><!-- .f_contact -->
        </div><!-- .grid_3 -->

        <div class="grid_3">
          <h3>信息</h3>
          <nav class="f_menu">
            <ul>
              <li><a href="/qd/blog.html">关于我们</a></li>
              <li><a href="#">隐私政策</a></li>
              <li><a href="#">条款及细则</a></li>
              <li><a href="#">安全付款</a></li>
            </ul>
          </nav><!-- .private -->
        </div><!-- .grid_3 -->

        <div class="grid_3">
          <h3>顾客服务</h3>
          <nav class="f_menu">
            <ul>
              <li><a href="/qd/contact_us.html">联系方式</a></li>
              <li><a href="#">返回</a></li>
              <li><a href="#">常见问题</a></li>
              <li><a href="#">网站地图</a></li>
            </ul>
          </nav><!-- .private -->
        </div><!-- .grid_3 -->
        <div class="clear"></div>
      </div><!-- .container_12 -->
    </div><!-- .f_navigation -->

    <div class="f_info">
      <div class="container_12" >
        <div class="grid_6" style="margin: 0 auto; width: 100%;">
          <p class="copyright" style="text-align: center;">© 钦州坭兴陶, 2020.07 </p>
        </div><!-- .grid_6 -->
        <div class="clear"></div>
      </div><!-- .container_12 -->
    </div><!-- .f_info -->
  </footer>
</div>
<script>
    let vue = new Vue({
        el: '#app',
        data() {
            return {
                flag:false,
                userName:""
            }
        },
        methods:{
            getUserInfo(){
                let userId = sessionStorage.getItem("userId");
                if (userId != null && userId != ""){
                    this.flag=true
                    this.userName=sessionStorage.getItem("userName")
                }
            },
            goOut(){
                sessionStorage.removeItem("userId")
                sessionStorage.removeItem("userName")
                window.location.href="/goods/index.html"
            }
        },
        created(){
            this.getUserInfo()
        }
    })
</script>
</body>
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
</html>